@import './variable.scss';

.fax {
  width: 100%;
  display: flex;

  .fax-nemu {
    flex: 0 0 px(120);
    min-width: px(120);
    
  }

  .el-menu {
    border: none;
    height: 100%;
    width: 100%;
    .el-menu-item{
      font-size: px(14);
      padding: 0 px(20);
      padding-left: px(20);
      height: px(50);
      line-height: px(50);
    }
  }

  .fax-container {
    flex: 0 1 auto;
    overflow: hidden;
    padding: px(15);

    .fax-item {
      ::v-deep .queryForm {
         .el-form-item {
          margin-bottom: 0;
        }
        .el-form-item__label,.el-form-item__content{
          height: px(34);
          line-height: px(34);
          font-size: px(14);
        }

        .el-input,
        .el-select {
          border-radius: px(5);
        }

        .el-input__inner {
          padding: 0 px(10);
          height: px(32);
          line-height: px(32);
          font-size: px(12);
          border-radius: px(5);
        }

        .el-form-item__label {
          padding-right: px(5);
        }
        .el-button{
          font-size: px(12);
          border-radius: px(3);
          padding: 0 px(15);
          height: px(32);
          line-height: px(32);
        }
        .el-input__icon{
          line-height: px(32);
          font-size: px(12);
        }
        .el-range-editor{
          min-width: px(220);
          .el-range-input{
            font-size: px(12);
          }
          .el-range-separator{
            height: px(20);
            line-height: px(20);
            font-size: px(12);
            padding: 0 px(5);
          }
        }
        
      }

      ::v-deep .el-row {
        margin-top: px(10);
        margin-bottom: px(10);
        .el-button{
          font-size: px(12);
          border-radius: px(3);
          padding: 0 px(15);
          height: px(32);
          line-height: px(32);
        }
      }

      ::v-deep .el-table{
        font-size: px(12);

        .el-table__empty-text{
          font-size: px(14);
        }

        .table-herder-fax {
          background-color: #00b2ee;
          color: #ffffff;
          font-size: px(14);
        }
        .el-table__body tr:hover > td {
          background-color: #d3e6ee;
        }
    
        .el-table__body tr.current-row > td {
          background: #a0d6e7 !important;
        }
  
        .cell{
          line-height: px(23);
          .el-link,.el-button{
            font-size: px(12);
          }
        }
      }
    }

    .fax-send {
      height: 100%;
      width: 100%;
      display: flex;
      ::v-deep .fax-form {
        position: relative;

        .el-form-item {
          margin-bottom: px(22);
          margin-right: px(10);
          &__content {
            line-height: px(34);
            display: flex;
            flex-direction: column;
          }
          &__label {
            line-height: px(32);
            font-size: px(16);
            width: px(100);
          }
          .el-input__inner {
            height: px(32);
            line-height: px(32);
            font-size: px(14);
            border-radius: px(5);
          }
          
          .el-select__input{
            font-size: px(14);
          }
          
        }

      }
      ::v-deep .receiver-select {
        ::v-deep .el-select__tags {
          max-width: 100% !important;
          max-height: px(150);
          overflow-y: auto;
          overflow-x: hidden;
        }
      }

      ::v-deep .el-tabs {
        margin-left: px(100);
        .el-tabs__item{
          font-size: px(14);
        }
        .el-textarea{
          font-size: px(14);
          .el-textarea__inner{
            border-radius: px(5);
          }
          
        }
        .upload-file{
          .el-button{
            width: px(80);
            font-size: px(12);
            border-radius: px(3);
            padding: 0 px(10);
            height: px(30);
            line-height: px(30);
          }
        }
      }

      ::v-deep .contact {
        flex: 0 0 px(200);
        // width: 200px !important;
        margin-left: px(20);
        background: #f5f5f5;

        .el-input__inner {
          padding: 0 px(10);
          height: px(32);
          line-height: px(32);
          font-size: px(12);
          border-radius: px(5);
        }

        .default-scrollbar {
          width: 100%;
          height: calc(100% - #{px(20)});
        }
        ::v-deep .default-scrollbar__wrap {
          width: auto;
          // height: 110%;
          overflow-x: hidden;
        }

        .el-tree {
          margin-right: px(7);
          background: #f5f5f5;
          color: #000000;

          ::v-deep .el-tree__empty-text{
            font-size: px(14);
          }
          ::v-deep .el-tree-node__content{
            height: px(32);
            line-height: px(32);
            &>.el-tree-node__expand-icon{
              padding: px(5);
              font-size: px(14);
            }
          }

          .el-tree-node__label{
            font-size: px(14);
          }

          .el-tree-node.is-current > .el-tree-node__content {
            background-color: #2f8dfb !important;
            color: white;
          }
  
          .el-tree-node__label {
            max-width: px(100);
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
          }
        }

        
      }

      ::v-deep .fax-buttons {
        position: absolute;
        left: px(100);
        bottom: px(50);
        .el-button {
          width: px(80);
          font-size: px(12);
          border-radius: px(3);
          padding: 0 px(15);
          height: px(32);
          line-height: px(32);
        }
      }
    }
  }


}
